<template>
    <div>
        <img src="../assets/images/ind_pic01.jpg" width="100%" alt="" />
        <div class="padding_lr15" style="padding: 10px 0px;border: 10px solid #efefef;border-width: 10px 0px;">
            <ul class="grid_box clearfix">
                <li v-for="(item,index) in gridList" :key="index" @click="goFun">
                    <img :src="item.pic" width="25" />
                    <p>{{item.txt}}</p>
                </li>
            </ul>
        </div>
        <img src="../assets/images/ind_pic03.jpg" width="100%" alt="" />
        <img src="../assets/images/ind_pic04.jpg" width="100%" alt="" />
        <img src="../assets/images/ind_pic05.jpg" width="100%" alt="" />
    </div>
</template>
<script>

    import '@/assets/css/main.css'
    export default {
        data(){
            return{
                gridList: [
                    {'pic': require('../assets/images/shjf_icon.png'),'txt': '生活缴费'},
                    {'pic': require('../assets/images/jyfw_icon.png'),'txt': '加油服务'},
                    {'pic': require('../assets/images/jp_icon.png'),'txt': '机票'},
                    {'pic': require('../assets/images/zd_icon.png'),'txt': '账单'},
                    {'pic': require('../assets/images/gd_icon.png'),'txt': '更多'},
                ],
            }
        },
        methods: {
            goFun(){
                this.$dialog.alert({
                    message: '敬请期待'
                }).then(() => {
                    
                });
            },
        },
        mounted(){
            
        },
    }
</script>